<template>
  <div class="goods_new">
    <van-nav-bar title="浏览足迹" left-arrow @click-left="goback"/>
    <van-list v-model="loading"
              :finished="finished"
              :immediate-check="false"
              finished-text="没有更多了"
              @load="getNewtList">
      <div v-for="(item, i) in list" :key="i">
        <van-row gutter="10" style="background: #fff;padding: 15px 0;margin:5px 0;">
          <van-col span="8">
            <router-link :to="'/art/' + item.id">
              <img :src="item.picUrl"
              style="width: 100%; max-height: 150px;" />
            </router-link>
          </van-col>
          <van-col span="16">
            <router-link :to="'/art/' + item.id">
              <div style="width: 100%;font-size:14px;color:#333;"> {{ item.name }}</div>
              <div style="width: 100%;font-size:12px;color:#ccc;"> {{ item.addTime.substr(0,10) }}</div>
              <div style="width: 100%;font-size:12px;color:#666;"> {{ item.brief }}</div>
              <div style="font-size:10px;color:#999;width:100%;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;">￥{{ item.retailPrice }}</div>
            </router-link>
          </van-col>
          <div>
          </div>
        </van-row>
      </div>
    </van-list>

  </div>
</template>

<script>
import { footprintList } from '@/api/api';
import { Toast, Card, NavBar, List, Row, Col } from 'vant';
import scrollFixed from '@/mixin/scroll-fixed';

export default {
  mixins: [scrollFixed],

  data() {
    return {
      list: [],
      page: 1,
      limit: 10,
      loading: false,
      finished: false
    };
  },

  created() {
    this.init();
  },

  methods: {
    init() {
      this.page = 0;
      this.list = [];
      this.getNewtList();
    },
    getNewtList() {
      this.page++;
      footprintList({
        page: this.page,
        limit: this.limit
      }).then(res => {
        console.log(res)
        this.list.push(...res.data.data.list);
        this.loading = false;
        this.finished = res.data.data.page >= res.data.data.pages;
      });
    },
    itemClick(id) {
      this.$router.push(`/items/detail/${id}`);
    },
    goback() {
      this.$router.go(-1);
    }
  },

  components: {

    [List.name]: List,
    [Row.name]: Row,
    [Col.name]: Col,
    [Card.name]: Card,
    [NavBar.name]: NavBar,
    Toast
  }
};
</script>

<style lang="scss" scoped>
</style>